<template>
  <div class="pro-file-list">
    <div
      class="pro-file-list-item"
      v-for="(item, index) in listArr"
      :key="index"
    >
      <span @click="itemClick(item)">{{ item.name }}</span>
    </div>
  </div>
</template>

<script>
import { Toast } from "vant";
export default {
  props: {
    listArr: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  methods: {
    itemClick(item) {
      if (item.name == "地址管理") {
        this.$router.push({
          path: "/address",
        });
      } else if (item.name == "我的收藏") {
        this.$router.push({
          path: "/collect",
        });
        console.log('我的')
      } else if (item.name == '意见反馈') {
        this.$router.push({
          path: "/feedback",
        });
      }
      else {
        Toast(item.name + "功能没开发");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.pro-file-list {
  display: flex;
  flex-wrap: wrap;
  .pro-file-list-item {
    width: 33%;
    text-align: center;
    span {
      display: flex;
      padding: 25px 0;
      justify-content: center;
      font-size: 14px;
    }
    border-bottom: 1px solid #ececec;
    border-right: 1px solid #ececec;
    &:nth-child(3n) {
      border-right: none;
      // color: red;
    }
    &:nth-child(7) {
      border-bottom: none;
      // color: red;
    }
    &:nth-child(8) {
      border-bottom: none;
      // color: red;
    }
  }
}
</style>